<template>
	<view id="main">
		<safe-hight-box background="#F7F7F7"></safe-hight-box>
		<view style="margin:0 auto;margin-top: 104upx;text-align: center;">
			<image class="logo" src="../../static/me2.png" mode="aspectFit"></image>
		</view>
		<view style="margin-top: 110upx;padding-left: 32upx;padding-right: 32upx;">
			<van-cell-group>
				<van-field :value="phone" @input="phone=$event.detail" label="手机号"placeholder="请输入手机号码" />
				<van-field :value="code" @input="code=$event.detail" label="验证码"placeholder="请输入验证码" >
					<button slot="button" class="codeButton buttonCenter">获取验证码</button>
				</van-field>
			</van-cell-group>
		</view>
		<button class="button" style="margin-top: 110upx;" @click="login">立即登录</button>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				phone:'',
				code:''
			}
		},
		methods:{
			login(){
				const that=this;
			}
		}
	}
</script>

<style lang="scss" scoped>
	.logo{
		width: 156upx;
		height: 156upx;
	}
	.forget{
		margin-top: 20upx;
		font-size: 24upx;
		font-weight: 500;
		color: #666666;
		text-align: right;
	}
	.codeButton{
		height: 50upx;
		width: 144upx;
		background: var(--theme-color);
		border-radius: 10upx;
		font-size: 24upx;
		font-weight: 500;
		color: #FFFFFF;
		margin: 0;
		padding: 0;
	}
</style>
